<SCRIPT LANGUAGE="JavaScript">  
    function validation()
    {
        var c = 0;
        var counter=document.getElementById('counter').value;
        var school="";
        var read="";
        var write="";                                     
        var listen="";
        var speak="";
        
        for( c = 0; c<counter; c+=1)
        {
            school='LanguageName'+c;
            read='LanguageRead'+c;
            write='LanguageWrite'+c;
            listen='LanguageListen'+c;
            speak='LanguageSpeak'+c;

            
            if( document.getElementById(school).value.length!=0 )
            {
                if( document.getElementById(read).value=="" )
                {
                    document.getElementById(read).focus();
                    document.getElementById(read).style.backgroundColor='#FFC';
                    alert("Please select value in 'reading'");
                    document.getElementById(read).style.backgroundColor='#FFF';
                    return false;
                }
                if( document.getElementById(write).value=="" )
                {
                    document.getElementById(write).focus();
                    document.getElementById(write).style.backgroundColor='#FFC';
                    alert("Please select value in 'writing'");
                    document.getElementById(write).style.backgroundColor='#FFF';
                    return false;
                }
                if( document.getElementById(listen).value=="" )
                {
                    document.getElementById(listen).focus();
                    document.getElementById(listen).style.backgroundColor='#FFC';
                    alert("Please select value in 'listening'");
                    document.getElementById(listen).style.backgroundColor='#FFF';
                    return false;
                }
                if( document.getElementById(speak).value=="" )
                {
                    document.getElementById(speak).focus();
                    document.getElementById(speak).style.backgroundColor='#FFC';
                    alert("Please select value in 'speaking'");
                    document.getElementById(speak).style.backgroundColor='#FFF';
                    return false;
                }

            }
            
        }
        
        
    
    }
    
    function test()
    {
        if( document.getElementById('counter').value >= 5 )
        { 
            alert("Sorry, not allowed more than 5");
            document.getElementById('Add').disabled=true; 
        
        }
        else
        {
            var co=parseInt(document.getElementById('counter').value)+1;
            document.getElementById('counter').value=co;
            if(co==5)
            { document.getElementById('Add').disabled=true; }
            co=co-1;
            var temp="<table cellpadding=0 cellspacing=0 class='education'><tr>";
            temp+="<td width='60px'>"+(co+1)+"</td>";
            temp+="<td width='120px'><input type='text' size='15' maxLength='20' id='LanguageName"+co+"' name='data["+co+"][Language][name]'></td>";
            temp+="<td width='80px'><select id='LanguageRead"+co+"' name='data["+co+"][Language][read]'><option value=''> </option><option value='Bad'>Bad</option><option value='Average'>Average</option><option value='Good'>Good</option></select></td>";
            temp+="<td width='80px'><select id='LanguageWrite"+co+"' name='data["+co+"][Language][write]'><option value=''> </option><option value='Bad'>Bad</option><option value='Average'>Average</option><option value='Good'>Good</option></select></td>";
            temp+="<td width='80px'><select id='LanguageListen"+co+"' name='data["+co+"][Language][listen]'><option value=''> </option><option value='Bad'>Bad</option><option value='Average'>Average</option><option value='Good'>Good</option></select></td>";
            temp+="<td width='80px'><select id='LanguageSpeak"+co+"' name='data["+co+"][Language][speak]'><option value=''> </option><option value='Bad'>Bad</option><option value='Average'>Average</option><option value='Good'>Good</option></select></td>";
            temp+="<td width='70px' style='border-bottom:none'><a href='Javascript:clean("+co+");'>Clear</a></td>";
            temp+="</tr></table>";
            document.getElementById('list').innerHTML+=temp;
        }

    }
    
    function clean(indeks)
    {
        var temp="";
        temp="LanguageName"+indeks;
        document.getElementById(temp).value="";
        temp="LanguageRead"+indeks;
        document.getElementById(temp).value="";
        temp="LanguageWrite"+indeks;
        document.getElementById(temp).value="";
        temp="LanguageListen"+indeks;
        document.getElementById(temp).value="";
        temp="LanguageSpeak"+indeks;
        document.getElementById(temp).value="";
        
    }
</SCRIPT>
<?php 
echo "<table class='table_resume'><tr>";
    echo "<td valign='top' width='260px'>";
    echo $this->element('menu_resume'); 
    echo "</td>";
    echo "<td class='pemisah'></td>";
    echo "<td valign='top'>";
    echo "<div class='form'>";
    echo "<h2> Language Skills</h2>";
    echo "<hr color='#2A7EF7'>";
        echo $form->create('Language',array('action'=>'index','onsubmit'=>'return validation();'));
            $max=3;
            if(count($languages)>3)
            { $max=count($languages); }
            
            echo "<input type='hidden' value=".$max." id='counter' name='data[counter]'>";
            
            echo "<table cellpadding=0 cellspacing=0 class='education' style='padding-top:10px'>";
            echo "<tr><th width='62px'>Record</th><th width='120px'><font color='red'>Language</font></th><th width='83px'>Reading</th><th width='84px'>Writing</th><th width='83px'>Listening</th><th width='83px'>Speaking</th></tr>";
            echo "</table>";
            
            for ($i=0;$i<$max;$i++)
            {
                echo "<table cellpadding=0 cellspacing=0 class='education'><tr>";
                    

                    if(!empty($languages[$i]))
                    {
                        echo "<td width='60px'>".($i+1)."</td>";
                        echo "<td width='120px'><input type='text' size='15' maxLength='20' id='LanguageName".$i."' name='data[".$i."][Language][name]' value='".$languages[$i]['Language']['name']."'></td>";     

                        if($languages[$i]['Language']['read']=='Bad')   
                        { echo "<td width='80px'><select id='LanguageRead".$i."' name='data[".$i."][Language][read]'><option value=''> </option><option value='Bad' selected='true'>Bad</option><option value='Average'>Average</option><option value='Good'>Good</option></select></td>"; }
                        if($languages[$i]['Language']['read']=='Average')   
                        { echo "<td width='80px'><select id='LanguageRead".$i."' name='data[".$i."][Language][read]'><option value=''> </option><option value='Bad'>Bad</option><option value='Average' selected='true'>Average</option><option value='Good'>Good</option></select></td>"; }
                        if($languages[$i]['Language']['read']=='Good')   
                        { echo "<td width='80px'><select id='LanguageRead".$i."' name='data[".$i."][Language][read]'><option value=''> </option><option value='Bad'>Bad</option><option value='Average'>Average</option><option value='Good' selected='true'>Good</option></select></td>"; }

                        if($languages[$i]['Language']['write']=='Bad')   
                        { echo "<td width='80px'><select id='LanguageWrite".$i."' name='data[".$i."][Language][write]'><option value=''> </option><option value='Bad' selected='true'>Bad</option><option value='Average'>Average</option><option value='Good'>Good</option></select></td>"; }
                        if($languages[$i]['Language']['write']=='Average')   
                        { echo "<td width='80px'><select id='LanguageWrite".$i."' name='data[".$i."][Language][write]'><option value=''> </option><option value='Bad'>Bad</option><option value='Average' selected='true'>Average</option><option value='Good'>Good</option></select></td>"; }
                        if($languages[$i]['Language']['write']=='Good')   
                        { echo "<td width='80px'><select id='LanguageWrite".$i."' name='data[".$i."][Language][write]'><option value=''> </option><option value='Bad'>Bad</option><option value='Average'>Average</option><option value='Good' selected='true'>Good</option></select></td>"; }

                        if($languages[$i]['Language']['listen']=='Bad')   
                        { echo "<td width='80px'><select id='LanguageListen".$i."' name='data[".$i."][Language][listen]'><option value=''> </option><option value='Bad' selected='true'>Bad</option><option value='Average'>Average</option><option value='Good'>Good</option></select></td>"; }
                        if($languages[$i]['Language']['listen']=='Average')   
                        { echo "<td width='80px'><select id='LanguageListen".$i."' name='data[".$i."][Language][listen]'><option value=''> </option><option value='Bad'>Bad</option><option value='Average' selected='true'>Average</option><option value='Good'>Good</option></select></td>"; }
                        if($languages[$i]['Language']['listen']=='Good')   
                        { echo "<td width='80px'><select id='LanguageListen".$i."' name='data[".$i."][Language][listen]'><option value=''> </option><option value='Bad'>Bad</option><option value='Average'>Average</option><option value='Good' selected='true'>Good</option></select></td>"; }
                               
                        if($languages[$i]['Language']['speak']=='Bad')   
                        { echo "<td width='80px'><select id='LanguageSpeak".$i."' name='data[".$i."][Language][speak]'><option value=''> </option><option value='Bad' selected='true'>Bad</option><option value='Average'>Average</option><option value='Good'>Good</option></select></td>"; }
                        if($languages[$i]['Language']['speak']=='Average')   
                        { echo "<td width='80px'><select id='LanguageSpeak".$i."' name='data[".$i."][Language][speak]'><option value=''> </option><option value='Bad'>Bad</option><option value='Average' selected='true'>Average</option><option value='Good'>Good</option></select></td>"; }
                        if($languages[$i]['Language']['speak']=='Good')   
                        { echo "<td width='80px'><select id='LanguageSpeak".$i."' name='data[".$i."][Language][speak]'><option value=''> </option><option value='Bad'>Bad</option><option value='Average'>Average</option><option value='Good' selected='true'>Good</option></select></td>"; }
                        echo "<td width='70px' style='border-bottom:none'><a href='Javascript:clean(".$i.");'>Clear</a></td>";



                    }
                    else
                    {
         
                        echo "<td width='60px'>".($i+1)."</td>";
                        echo "<td width='120px'><input type='text' size='15' maxLength='20' id='LanguageName".$i."' name='data[".$i."][Language][name]'></td>";     
                        echo "<td width='80px'><select id='LanguageRead".$i."' name='data[".$i."][Language][read]'><option value=''> </option><option value='Bad'>Bad</option><option value='Average'>Average</option><option value='Good'>Good</option></select></td>";        
                        echo "<td width='80px'><select id='LanguageWrite".$i."' name='data[".$i."][Language][write]'><option value=''> </option><option value='Bad'>Bad</option><option value='Average'>Average</option><option value='Good'>Good</option></select></td>";        
                        echo "<td width='80px'><select id='LanguageListen".$i."' name='data[".$i."][Language][listen]'><option value=''> </option><option value='Bad'>Bad</option><option value='Average'>Average</option><option value='Good'>Good</option></select></td>";        
                        echo "<td width='80px'><select id='LanguageSpeak".$i."' name='data[".$i."][Language][speak]'><option value=''> </option><option value='Bad'>Bad</option><option value='Average'>Average</option><option value='Good'>Good</option></select></td>";        
                        echo "<td width='70px' style='border-bottom:none'><a href='Javascript:clean(".$i.");'>Clear</a></td>";

                    }        
                echo "</tr></table>";        

                
            }                        
            echo "<span id='list'></span>";
            
            echo "<br>";
            echo "&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp"; 
            echo "<input type='button' id='Add' value='Add Record' onClick='test();'> &nbsp <input type='submit' value='Save & Next'>";
        echo "</form>";
    
        echo "<br>:. <span class='info'>Provide your language skills ( Max : 5 ) </span>";
        echo "<br>:. <span class='red'>All fields </span> <span class='info'> are required fields</span>";
        echo "<br>:. <span class='info'>If you blank the </span><span class='red'>Language </span> <span class='info'> field, it will be ignored</span>";

    echo "</div>";
    echo "</td>";
echo "</tr></table>";     
    
?>